<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0,maximum-scale=1, minimum-scale=1, user-scalable=no" />
    <meta name="format-detection" content="telephone=no" />
    <title>充值明细</title>
    <style>
        * {
            padding: 0;
            margin: 0;
            box-sizing: border-box;
            font-family: 'PingFang-SC-Regular', 'PingFang-SC-Medium,微软雅黑', Helvetica, Arial, sans-serif;
            line-height: 100%
        }

        html,
        body {
            height: 100%;
            background: #fff;
            font-size: 0.26rem
        }

        a:link,
        a:visited,
        a:hover,
        a:active {
            text-decoration: none;
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            color: #262626;
            text-align: center;
            display: inline-block
        }

        a {
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        }

        input,
        button,
        textarea,
        select {
            outline: none;
            border: none;
            margin: 0;
            -webkit-tap-highlight-color: rgba(240, 240, 240, 0);
            padding: 0;
        }

        .width100 {
            width: 100%;
        }

        .container {
            min-height: 100%;
            background: #fff;
            color: #262626;
        }

        .textCenter {
            text-align: center
        }

        img {
            font-size: 0;
        }

        .title {
            background: #F8F8F8;
            padding: 0.2rem 0.29rem;
            display: block;
            overflow: hidden;
        }

        .title>span {
            display: block;
            float: left;
        }

        .title>span:first-child,
        .list>p>span:first-child {
            width: 1.2rem;
        }

        .title>span:last-child,
        .list>p>span:last-child {
            width: 3rem;
            text-align: right;
        }

        .title>span:nth-child(2),
        .list>p>span:nth-child(2) {
            width: calc(100% - 4.2rem);
            text-align: left;
            padding-left: 0.7rem;
            box-sizing: border-box;
        }

        .list {
            padding: 0 0.3rem;
        }

        .list>p {
            font-size: 0.26rem;
            padding: 0.3rem 0;
            border-bottom: 0.015rem solid #F5F6F8;
            overflow: hidden;
        }

        .list>p>span {
            display: block;
            float: left;
            line-height: 100%;
        }

        .list>p>span:last-child {
            color: #F15342;
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            align-items: flex-end;
            justify-content: center;
        }

        .loadBox {
            padding: 0.3rem 0;
            text-align: center;
            overflow: hidden;
        }

        .loadinfo {
            text-align: center;
            color: #595959;
            font-size: 0.22rem;
            padding: 0.14rem 0.25rem;
            border-radius: 0.06rem;
            display: inline-block;
        }
    </style>
</head>

<body>
    <div class="container">
        <p class="title">
            <span>充值天数</span>
            <span>充值日期</span>
            <span>充值金额</span>
        </p>
        <section class="list">
            <!-- <p>
                <span>30天</span>
                <span>2020-05-23</span>
                <span>
                    <span>￥ 0.00</span>
                    <span>￥ 0.00</span>
                </span>
            </p> -->
        </section>
        <div class="loadBox">
            <span class="loadinfo">加载中...</span>
        </div>
    </div>
</body>

</html>
<script src="../../script/autosize.js"></script>
<script src="../../script/fastclick.js"></script>
<script src="../../script/jquery_three_two_one.js"></script>
<script src="../../script/dotmin.js"></script>
<script src="../../script/app.js"></script>
<script id="list" type="text/html">
    {{~it:value:index}}
    <p>
        <span>{{=value.num}}天</span>
        <span>{{=value.time_create}}</span>
        {{?value.currency_code == "BTC"}}
        <span>
            <span>
                {{=value.currency_code =="USDT"?"usdt":"￥"}} {{=value.amount_cny}}
            </span>
            <span>{{=value.amount}} BTC 抵扣</span>
        </span>
        {{??}}
        <span>
            <span>
                {{=value.currency_code =="USDT"?"usdt":"￥"}} {{=value.amount}}
            </span>
        </span>
        {{?}}
    </p>
    {{~}}
</script>
<script>
    apiready = function () {
        var app = new APP();
        var order_id = api.pageParam.order_id;//订单id
        var account = app.getAccount();
        var loadinfo = $(".loadinfo");
        //加载列表
        app.ajaxPro({
            url: "order/get-charge-epower",
            values: {
                token: account.token,
                order_id: order_id,
            },
            openFlower: true
        }, function (ret) {
            // app.log('ret+++++++++', ret);
            if (ret.code == 200) {
                var list = ret.data.list;
                for (var i = 0; i < list.length; i++) {
                    var cur = list[i];
                    cur.amount_cny = app.sliceNum(cur.amount_cny, 2);
                    cur.time_create = cur.time_create.split(" ")[0];
                    if (cur.currency_code != "BTC") {
                        if (cur.currency_code != "USDT") {
                            cur.amount = app.sliceNum(cur.amount, 2);
                        } else {
                            cur.amount_cny = app.sliceNum(cur.amount_cny, 4);
                            cur.amount = app.sliceNum(cur.amount, 4);
                        }
                    } else {
                        cur.amount = app.sliceNum(cur.amount, 8);
                    }
                }
                var temp = doT.template($("#list").text());
                $(".list").html(temp(list));
            }
            loadinfo.text('到底了...');
        });
    }
</script>